<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作业</title>
<div class="shape semi-circle"></div>
<style>
.semi-circle {
    width: 100px;
    height: 50px;
    background-color: purple;
    border-radius: 100px 100px 0 0;
    margin-bottom: 20px;
}
</style>
<div class="shape quarter-circle"></div>
<style>
.quarter-circle {
    width: 100px;
    height: 100px;
    background-color: orange;
    border-radius: 0 0 100% 0;
    margin-bottom: 20px;
}
</style>
<div class="shape rounded-rectangle"></div>
<style>
.rounded-rectangle {
    width: 150px;
    height: 100px;
    background-color: blue;
    border-radius: 20px;
    margin-bottom: 20px;
}
</style>
<div class="shape ellipse"></div>
<style>
.ellipse {
    width: 150px;
    height: 100px;
    background-color: red;
    border-radius: 50%;
    margin-bottom: 20px;
}
</style>
<div class="shape diamond"></div>
<style>
.diamond {
    width: 100px;
    height: 100px;
    background-color: pink;
    border-radius: 15px;
    transform: rotate(45deg);
    margin-bottom: 20px;
}
</style>
<div class="shape square"></div>
<style>
.square {
    width: 100px;
    height: 100px;
    background-color: black;
    border-radius: 0;
    margin-bottom: 20px;
}
</style>
<div class="shape leaf"></div>
<style>
.leaf {
    width: 100px;
    height: 100px;
    background-color: yellowgreen;
    border-radius: 0 100% 0 100%;
    margin-bottom: 20px;
}
</style>
</style>
</style>
<div class="shape egg"></div>
<style>
.egg {
    width: 100px;
    height: 140px;
    background-color: yellow;
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    margin-bottom: 20px;
}
</style>
<div class="shape irregular"></div>
<style>
.irregular {
    width: 150px;
    height: 100px;
    background-color: red;
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    margin-bottom: 20px;
}
</style>

</head>
<body>

</body>
</html>